<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <title>乐创能幼儿园在校智能管理平台</title>
    <link rel="shortcut icon" href="assets/img/favicon/favicon.ico" type="image/x-icon"/>
    <link rel="icon" href="assets/img/favicon/favicon.ico" type="image/x-icon"/>
    <link rel="stylesheet" type="text/css" media="screen" href="assets/css/bootstrap.min.css"/>
    <link rel="stylesheet" type="text/css" media="screen" href="assets/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,300,400,700"/>
    <link rel="stylesheet" href="assets/css/login.css"/>
</head>
<body class="animated fadeInDown">
    <header id="header">
        <div id="logo-group">
            <span id="logo"> <img src="assets/img/logo.png" alt="乐创能幼儿园在校智能管理平台"/>乐创能幼儿园在校智能管理平台 </span>
        </div>
    </header>
    <div id="main" role="main">

        <!-- MAIN CONTENT -->
        <div id="content" class="container">

            <div class="row">
                <div class="col-xs-12 col-sm-12 col-md-7 col-lg-8 hidden-xs hidden-sm">
                    <h1 class="txt-color-red login-header-big">乐创能教育</h1>
                    <div class="hero">

                        <div class="pull-left login-desc-box-l">
                            <h4 class="paragraph-header">It's Okay to be Smart. Experience the simplicity of SmartAdmin, everywhere you go!</h4>
                            <div class="login-app-icons">
                                <a href="javascript:void(0);" class="btn btn-danger btn-sm">幼儿园入住</a>
                                <a href="javascript:void(0);" class="btn btn-danger btn-sm">系统故障上报</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-xs-12 col-sm-12 col-md-5 col-lg-4">
                    <div class="well no-padding">
                        <form action="index.html" id="login-form" class="smart-form client-form">
                            <header>
                                登录
                            </header>

                            <fieldset>

                                <section>
                                    <label class="label">登录名</label>
                                    <label class="input"> <i class="icon-append fa fa-user"></i>
                                        <input type="email" name="email">
                                        <b class="tooltip tooltip-top-right"><i class="fa fa-user txt-color-teal"></i>请输入登录名，登录名可以是手机号/用户账号/邮箱</b></label>
                                </section>

                                <section>
                                    <label class="label">密码</label>
                                    <label class="input"> <i class="icon-append fa fa-lock"></i>
                                        <input type="password" name="password">
                                        <b class="tooltip tooltip-top-right"><i class="fa fa-lock txt-color-teal"></i>请输入密码</b> </label>
                                    <div class="note">
                                        <a href="forgotpassword.html">忘记密码?</a>
                                    </div>
                                </section>

                                <section>
                                    <label class="checkbox">
                                        <input type="checkbox" name="remember" checked="">
                                        <i></i>记住密码</label>
                                </section>
                            </fieldset>
                            <footer>
                                <button type="submit" class="btn btn-primary">
                                    登录
                                </button>
                            </footer>
                        </form>
                    </div>
                </div>
            </div>
        </div>

    </div>
    <script src="assets/js/plugin/pace/pace.min.js"></script>
    <script src="assets/js/libs/jquery-2.1.1.min.js"></script>
    <script src="assets/js/app.config.js"></script>
    <!-- BOOTSTRAP JS -->
    <script src="assets/js/bootstrap/bootstrap.min.js"></script>
    <!-- JQUERY VALIDATE -->
    <script src="assets/js/plugin/jquery-validate/jquery.validate.min.js"></script>
    <!-- JQUERY MASKED INPUT -->
    <script src="assets/js/plugin/masked-input/jquery.maskedinput.min.js"></script>
    <script src="assets/js/app.min.js"></script>
    <script type="text/javascript">
        runAllForms();
        $(function() {
            // Validation
            $("#login-form").validate({
                // Rules for form validation
                rules : {
                    email : {
                        required : true,
                        email : true
                    },
                    password : {
                        required : true,
                        minlength : 3,
                        maxlength : 20
                    }
                },

                // Messages for form validation
                messages : {
                    email : {
                        required : 'Please enter your email address',
                        email : 'Please enter a VALID email address'
                    },
                    password : {
                        required : 'Please enter your password'
                    }
                },

                // Do not change code below
                errorPlacement : function(error, element) {
                    error.insertAfter(element.parent());
                }
            });
        });
    </script>
</body>
</html>